<template>
    <div>
        <el-dialog :visible.sync="dialogVisible" title="邀请查询记录" width="1000px">
            <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;">
                <span>邀请人ID: {{ detailInfo.id }}</span>
                <span>邀请人昵称: {{ detailInfo.nickname }}</span>
                <span>邀请用户手机号:{{ detailInfo.phoneNumber }}</span>
            </div>
            <el-table size="mini" :data="tableData.data" border style="width: 100%" v-loading="listLoading">
                <el-table-column align="center" label="序号" type="index" width="80"></el-table-column>
                <el-table-column align="center" label="活动名称" prop="activateName"></el-table-column>
                <el-table-column align="center" label="被邀请用户ID" prop="invitationId"></el-table-column>
                <el-table-column align="center" label="被邀请用户昵称" prop="invitationName"></el-table-column>
                <el-table-column align="center" label="被邀请用户手机号" prop="invitationNumber"></el-table-column>
                <el-table-column align="center" label="查询企业" prop="queryEnterprise"></el-table-column>
                <el-table-column align="center" label="查询时间" prop="queryTime"></el-table-column>
            </el-table>
            <el-pagination class="pageRight" background layout="total, sizes, prev, pager, next, jumper"
                :page-sizes="[10, 20, 50, 100]" :page-size="searchForm.pageSize" :total="tableData.total"
                @size-change="handleSizeChange" @current-change="handleCurrentChange"></el-pagination>
        </el-dialog>
    </div>
</template>
<script>
import { getBrokerageUserInviteRecord } from "@/api/brokerage";
export default {
    data() {
        return {
            dialogVisible: false,
            detailInfo: {},
            searchForm: {
                pageNum: 1,
                pageSize: 10,
                memberId: ''
            },
            listLoading: false,
            tableData: {
                data: [],
                total: 0
            }
        };
    },
    methods: {
        getList() {
            this.listLoading = true;
            getBrokerageUserInviteRecord(this.searchForm).then(res => {
                this.listLoading = false;
                this.tableData.total = res.data.total;
                this.tableData.data = res.data.list;
            });
        },
        open(val) {
            this.detailInfo = val;
            this.searchForm.memberId = val.id;
            this.getList();
            this.dialogVisible = true;
        },
        handleClose() {
            this.dialogVisible = false;
        },
         handleSizeChange(val) {
            this.searchForm.pageSize = val
            this.getList()
        },
        handleCurrentChange(val) {
            this.searchForm.pageNum = val
            this.getList()
        },
    }
};
</script>